<!--
-->
<template>
    <div class="set-account">
        <div class="setList" @click="set()">
            <div class="setList-left">账号设置</div>
            <div class="setList-right">
                <i class="iconfont icon-jiantou"></i>
            </div>
        </div>
        <!--设置-->
        <div v-if="show" class="set-wrap index9">
            <div id="purchased">
                <div class="purchased-top">
                    <i class="iconfont icon-fanhui" @click="close"></i>
                    <span>账号设置</span>
                </div>
            </div>
            <div>
                <!--设置密码-->
                <div class="settingList">
                    <set-password :user="user"></set-password>
                </div>

                <!--账号绑定-->
                <div class="hintpw mf12">第三方账号绑定</div>
                <div class="settingList">
                    <div class="setList border-bottom" @click="bindWx" v-if="user.baseUser.unionid == null || user.baseUser.unionid == ''">
                        <div class="setList-left">微信</div>
                        <div class="setList-right">
                            <i class="iconfont icon-jiantou"></i>
                        </div>
                    </div>
                    <div class="setList border-bottom" v-if="user.baseUser.unionid != null && user.baseUser.unionid != ''">
                        <div class="setList-left">微信</div>
                        <div class="setList-right">
                            <span class="wxBindText">已绑定</span>
                        </div>
                    </div>
                    <div class="setList border-bottom" @click="qqbind">
                        <div class="setList-left">QQ</div>
                        <div class="setList-right">
                            <i class="iconfont icon-jiantou"></i>
                        </div>
                    </div>
                    <div class="setList border-bottom" @click="qqbind">
                        <div class="setList-left">微博</div>
                        <div class="setList-right">
                            <i class="iconfont icon-jiantou"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import {userService} from '../../service/userService'
    import {commonService} from '../../service/commonService'
    import setPassword from '../../component/mycenter/password.vue'
    export default {
        data () {
            return {
                show:false,
                value:'',
                change:'',
                type:1,
                GWC: {
                    version: '1.1.1',
                    urlParams: {},
                },
                code:''
            }
        },
        components: {'set-password':setPassword , },
        props:['user'],
        watch:{
            /*option(cur,old){
                this.value=cur.value
            }*/
        },
        mounted:function(){
            let that = this;
            let code = window.localStorage.getItem('code')
            console.log(code)
            if(code){
                that.code = code;
                window.localStorage.removeItem('code')
                that.bindWx()
            }
        },
        methods:{
            //更改字段
            save:function(){
                let that = this;
                let params={};
                /*params[that.option.keyword]=that.value
                userService.myCenterSet(params).then(function (res) {
                    that.change = true;
                    that.option.value = that.value
                    that.show = false;
                });*/
            },
            //清除按钮
            clean:function(){
                this.value = ''
            },
            set:function(){
                this.show = true
            },
            close:function(){
                this.value = ''
                this.show = false
            },
            isWeiXin:function(){
                var ua = window.navigator.userAgent.toLowerCase();
                if (ua.match(/MicroMessenger/i) == 'micromessenger') {
                    return true;
                } else {
                    return false;
                }
            },
            appendParams: function(url, params) {
                let that = this
                if (params) {
                    var baseWithSearch = url.split('#')[0];
                    var hash = url.split('#')[1];
                    for (var key in params) {
                        var attrValue = params[key];
                        if (attrValue !== undefined) {
                            var newParam = key + "=" + attrValue;
                            if (baseWithSearch.indexOf('?') > 0) {
                                var oldParamReg = new RegExp('^' + key + '=[-%.!~*\'\(\)\\w]*', 'g');
                                if (oldParamReg.test(baseWithSearch)) {
                                    baseWithSearch = baseWithSearch.replace(oldParamReg, newParam);
                                } else {
                                    baseWithSearch += "&" + newParam;
                                }
                            } else {
                                baseWithSearch += "?" + newParam;
                            }
                        }
                    }

                    if (hash) {
                        url = baseWithSearch + '#' + hash;
                    } else {
                        url = baseWithSearch;
                    }
                }
                return url;
            },
            getUrlParams: function() {
                let that = this
                var pairs = location.search.substring(1).split('&');
                for (var i = 0; i < pairs.length; i++) {
                    var pos = pairs[i].indexOf('=');
                    if (pos === -1) {
                        continue;
                    }
                    that.GWC.urlParams[pairs[i].substring(0, pos)] = decodeURIComponent(pairs[i].substring(pos + 1));
                }
            },
            //绑定微信
            bindWx:function(){
                //判断浏览器
                let that = this
                let isWeiXin = that.isWeiXin()
                if(isWeiXin){
                    if(!that.code){
                        userService.getWxpay({loginType:'WEIXIN',platform:'WXH5',jumpRouter:'wxBind',wxscope:'snsapi_userinfo'}).then(function(res){
                            if(res.data.success){
                                console.log(res.data.datas)
                                window.location.href = res.data.datas;
                            }
                        })
                    }else{
                        //第二步，从微信授权页面跳转回来，已经获取到了code
                        userService.wxBind({code:that.code,plat:'wx'}).then(function(res){
                            console.log(res)
                            if(res.data.success){
                                that.user.baseUser.unionid = true;
                            }
                        })
                    }
                }else{
                    commonService.autoCloseModal(that, '请在微信内打开进行绑定', 1)
                }
            },
            qqbind:function(){
                let that = this;
                commonService.autoCloseModal(that, '该功能暂无开通，敬请期待', 1)
            }
        }
    }
</script>

<style lang="less">
.set-account{
    .index9{
        index:9!important
    }
    .mf12{
        margin-bottom: -12px;
    }
}

</style>